<template>
	<view class="custom_vertical_list_tabs">
		<Tabs @tabClick="tabClick" :tabData="item" :isFixed="tabIsFixed" :isBrowser="isBrowser"></Tabs>
		<view class="custom_vertical_list_tabs_item">
			<!-- #ifdef MP-WEIXIN -->
			<view wx:for="(sitem, index) in item" wx:key="'tabs_'+index" :ref="'tabs_content_' + index" v-if="currentTab === index">
				<slot name="tabsContent" :listItems="sitem"></slot>
			</view>
			<!-- #endif -->
			<!-- #ifndef MP-WEIXIN -->
			<view v-for="(sitem, index) in item" :key="'tabs_' + index" :ref="'tabs_content_' + index" v-if="currentTab === index">
				<slot name="tabsContent" :listItems="sitem"></slot>
			</view>
			<!-- #endif -->
		</view>
	</view>
</template>

<script>
import Tabs from '../liuyuno-tabs/liuyuno-tabs.vue';
export default {
	name: 'custom-vertical-list-tabs',
	components: {
		Tabs
	},
	props: {
		item: {
			type: Array,
			default() {
				return [];
			}
		},
		tabIsFixed: {
			type: Boolean,
			default() {
				return true;
			}
		},
		isBrowser: {
			type: Boolean,
			default() {
				return false;
			}
		}
	},
	data() {
		return {
			currentTab: 0
		};
	},
	methods: {
		tabClick(e) {
			this.currentTab = e;
		}
	}
};
</script>

<style lang="less">
.custom_vertical_list_tabs {
	custom_vertical_list_tabs_item {
		min-height: 600rpx;
	}
}
</style>
